<!DOCTYPE html>
<html lang="zh">

<head>
  <meta charset="UTF-8">
  <meta name="viewport"
    content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
  <title>cv-2020</title>
  <style>
    * {
      box-sizing: border-box;
    }

    body {
      background: #eee;
      margin: 20px 0;
    }

    article {
      width: 21cm;
      min-height: 29.7cm;
      background: white;
      margin: 0 auto;
      overflow: auto;
      padding: 1em;
    }
  </style>
  <style media="print">
    body {
      margin: 0;
    }

    .page2 {
      page-break-before: always;
      margin-top: 30px;
    }
  </style>
  <style>
    body {}

    p {
      margin: .3em 0;
    }

    h1 {
      font-size: 25px;
      margin-top: 0;
    }

    h4,
    h5,
    h6 {
      font-weight: normal;
    }

    ol,
    ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    strong {
      font-weight: normal;
      color: #f60;
    }

    a {
      color: #999;
      text-decoration: none;
      border-bottom: 1px solid;
    }

    p,
    li {
      color: #666;
    }

    strong {
      font-weight: normal;
    }

    h3,
    h4,
    h5,
    h6 {
      margin: 0;
    }

    .bio {
      position: relative;
    }

    .bio img {
      position: absolute;
      top: 0;
      right: 0;
    }
  </style>

  <style>
    .projects {}

    .projects p {
      color: #666;
    }

    .projects strong {
      color: #f60;
    }

    .projects>ol {
      margin-top: 0;
      list-style-position: inside;
      padding: 0;
    }

    .projects>ol>li {
      margin-bottom: 24px;
    }

    .projects>ol>li>header {
      display: flex;
      justify-content: space-between;
    }

    .projects>ol>li h3 {
      display: inline-block;
    }
  </style>
  <style>
    .skills {}

    #skills {
      width: 500px;
      height: 270px;
    }

    .skills>.wrapper {
      display: flex;
      justify-content: space-between;
    }

    .skills>.wrapper>:first-child {
      margin-right: 24px;
    }

    .skills>.wrapper>#skills {}

    .skills>.wrapper>ul {
      color: #666;
    }

    .skills>.wrapper strong {
      color: #f60;
    }

    .skills>.wrapper>ul>li {
      line-height: 1.2;
      margin-bottom: 8px;
    }
  </style>
  <style>
    .openSource {}

    .openSource>h2 {}

    .openSource header img {
      position: absolute;
      top: 0;
      right: 0;
    }

    .openSource>ul {}

    .openSource>ul>li {
      margin-bottom: 24px;
    }

    .openSource header {
      position: relative;
      display: flex;
      justify-content: space-between;
    }

    .openSource h3 {}
  </style>
  <style>
    .jobs {}

    .jobs>h2 {}

    .jobs>ol {}

    .jobs>ol>li {
      margin: 12px 0;
    }

    .jobs header {
      display: flex;
      color: #666;
      margin-bottom: 12px;
    }

    .jobs header>h3 {
      font-size: 18px;
      color: #333;
    }

    .jobs header>h4 {
      margin-left: 1em;
      font-size: 18px;
    }

    .jobs header>span {
      font-size: 18px;
      margin-left: auto;
    }
  </style>


  <style>
    @media (max-width: 500px) {
      body {
        margin: 0;
      }

      article {
        width: auto;
        height: auto;
      }

      .bio img {
        display: none;
      }

      .skills .wrapper {
        flex-direction: column;
      }

      #skills {
        width: auto;
      }
      .jobs header{
        flex-direction: column;
      }
      .jobs header >h3,
      .jobs header >h4,
      .jobs header >span {
        margin: 0;
      }
    }
  </style>
</head>

<body>
  <article>
    <section class="bio">
      <h1>许静</h1>
      <img src="./images/2.jpg" alt="" width="100" height="140">
      <p>
        女 | 26岁 | 前端开发工程师
      </p>
      <p>
        手机：18255478499 | 微信：JingX-A | 邮箱：xujing_xj@foxmail.com
      </p>
    </section>

    <section class="education">
      <h2>教育经历</h2>
      <p>
        <span><time>2012年</time>~<time>2016年</time></span>
        安徽理工大学 测绘工程 本科
      </p>

      <p>全国计算机等级二级（ <strong>C 语言</strong> ）、英语六级</p>
    </section>

    <section class="skills">
      <h2>专业技能</h2>
      <div class="wrapper">
        <!--        <div id="skills"></div>-->
        <ul style="list-style: circle inside;">
          <li>熟练使用 <strong>HTML</strong> / <strong>CSS</strong>，熟练使用 <strong>Flex</strong> 布局， 高度还原设计稿</li>
          <li>熟练使用 <strong>HTML5</strong> 语义化标签 、 <strong>CSS3</strong> / <strong>SCSS</strong></li>
          <li>熟练使用 <strong>JavaScript</strong>，理解重要概念如闭包、作用域、原型、异步操作等</li>
          <li>熟悉 <strong>前后端分离</strong> 技术， 包括 AJAX、跨域、前端路由等 </li>
          <li>熟练使用 <strong>Vue 全家桶</strong>，包括 VueCli、VueRouter、Vuex 等</li>
          <li>熟练使用 <strong>ES6</strong>，包括 let / 箭头函数 / await / 解构赋值 等</li>
          <li>了解 <strong>HTTP</strong> 相关知识</li>
          <li>熟悉 <strong>uni-app</strong>、<strong>小程序</strong>，了解 <strong>Flutter</strong></li>
        </ul>
      </div>
    </section>

    <section class="projects">
      <h2>项目经历</h2>
      <ol>
        <li>
          <header>
            <h3>木屋烧烤</h3>
            <span>
             <!-- <a href="#">源码链接</a>
             <a href="#">项目预览</a> -->
              <time>2019年09月</time>~<time>2019年11月</time>
            </span>
          </header>
          <p>用于木屋烧烤店的一套工位管理系统，我负责的部分：</p>
          <p>
             1. <strong>后台管理系统</strong> 的值班经理端
          </p>
          <p>
            使用 <strong>vue</strong> / <strong>vue-router</strong> / <strong>elementUI</strong> 开发
          </p>
          <p>
            2. <strong>工位助手</strong>（ H5 ）的考评功能
          </p>
          <p>
            工位助手是使用 <strong>vue</strong> / <strong>vantUI</strong> 开发的、嵌在钉钉的 H5 微应用
          </p>
          <p>
            实现了 <strong>自定义考评表单</strong>、<strong>考评表单暂存</strong>、<strong>拖拽排班</strong> 等功能
          </p>
        </li>
        <li>
          <header>
            <h3>木鱼找件</h3>
            <span>
<!--              <a href="#">源码私有</a>-->
<!--              <a href="#">项目预览</a>-->
                  <time>2019年10月</time>~<time>2019年12月</time>
            </span>
          </header>
          <p>为汽车维修业务寻找配件的系统，我负责的部分：</p>
          <p>
            1. 后台管理系统
          </p>
          <p>
            实现汽车配件的增删查改、商户入驻审核、图片设置、资金管理、账户设置等功能
          </p>

          <p>
            2. 商户端 ( <strong>微信小程序</strong>  )
          </p>
          <p>
            这是汽配厂入驻平台，实现了店铺设置、店铺管理、订单管理等功能
          </p>
          <p>
              <strong>※</strong> 处理复杂一些的逻辑，更加要注意一个方法只处理一件事情，这样代码才清晰
          </p>
        </li>
        <li>
          <header>
            <h3>礼品助手</h3>
            <span>
<!--              <a href="#">源码私有</a>-->
<!--              <a href="#">项目预览</a>-->
                  <time>2019年12月</time>~<time>2020年01月</time>
            </span>
          </header>
          <p>
            一套礼品定制化解决方案，我负责的部分：
          </p>
          <p>
            实现礼品模板设置、 logo 定制（ 拖拽定位 ）等功能
          </p>
          <p>
            <strong>※</strong>  更加重视组件化开发，使我对单向数据流的好处有了更深的理解
          </p>
        </li>
        <li class="page2">
          <header>
            <h3>直播购</h3>
            <span>
<!--              <a href="#">源码私有</a>-->
              <!--              <a href="#">项目预览</a>-->
              <time>2020年03月</time>~<time>至今</time>
            </span>
          </header>
          <p>
            荣电以直播形式卖商品的平台，我负责的部分：
          </p>
          <p>
            1. 后台管理系统
          </p>
          <p>
            实现留言、禁言、敏感词设置、数据统计、机器人留言等功能
          </p>
          <p>
            2. 商家助手直播（ 移动端 ）(<strong>uni-app</strong>)
          </p>
          <p>
            实现创建直播、添加商品、点赞、操作优惠券等功能
          </p>
        </li>
      </ol>
    </section>


    <section class="openSource">
      <h2>开源项目</h2>
      <ul>
        <li>
          <header>
            <h3>UI 组件库（ 更新中 ）</h3>
            <span>
               <a target="_blank" href="https://github.com/xjxujing/wheels-demo">源码</a>
               <a target="_blank" href="https://xjxujing.github.io/wheels-demo/components/button.html">文档</a>
            </span>
          </header>
          <p>目前有按钮、输入框、选项卡等，练习和提升 Vue 的熟练度和代码质量</p>
        </li>
      </ul>
    </section>


    <section class="jobs">
      <h2>工作经历</h2>
      <ol>
        <li>
          <header>
            <h3>荣电集团 —— 掌触科技</h3>
            <h4>前端开发工程师</h4>
            <span><time>2019年9月</time>~<time>至今</time></span>
          </header>
          <ul>
            <li>
              负责公司的后台管理系统的开发和维护工作
            </li>
            <li>
              负责公司 <strong> SaaS 系统</strong> 的功能性组件的开发和维护工作
            </li>
            <li>
              团队定期分享、探讨技术，包括 Git 的使用、<strong>ES6 新特性</strong>、<strong>Flutter</strong> 等话题
            </li>

          </ul>
        </li>
        <li>
          <header>
            <h3>科大讯飞</h3>
            <h4>AIUI 平台技术支持、识别优化</h4>
            <span><time>2018年6月</time>~<time>2019年6月</time></span>
          </header>
          <ul>
            <li>1. 技术支持</li>
            <li>讯飞 AIUI 开放平台技术对接、SDK 接口调用指导等</li>
            <li>2. 识别优化</li>
            <li>对业务线反馈的识别问题进行定位分析</li>
            <li>使用 <strong>Perl</strong> / <strong>Python</strong> 做文本批处理，部分语言模型训练工作</li>
            <li> ( 在职期间表现优异，绩效考核多次为 <strong>A</strong> )</li>
          </ul>
        </li>
      </ol>
    </section>

    <section class="others">
      <h2>其他链接</h2>
      <ul>
        <li><a href="https://github.com/xjxujing" target="_blank">我的 GitHub</a></li>
      </ul>
    </section>

  </article>
  <!-- <script src="https://cdn.bootcss.com/echarts/4.6.0/echarts.min.js"></script> -->
  <script src="./main.js"></script>
</body>

</html>
